<template>
    <p v-if="age < 5">婴儿</p>
    <p v-if="age < 18">少年</p>
    <p v-if="age < 30">青年</p>
    <p v-if="age < 65">中年</p>
    <p v-if="age >= 65">中年</p>
    <hr>
    <p v-if="age < 5">婴儿</p>
    <p v-else-if="age < 18">少年</p>
    <p v-else-if="age < 30">青年</p>
    <p v-else-if="age < 65">中年</p>
    <p v-else>中年</p>
    <hr>
    <!-- 
        v-show实现的是display的样式效果
        当值为true时,显示元素
        当值为false时,隐藏元素,即display的值为none
    -->
    <p v-show="flag">第一个段落</p>
    <p v-show="!flag">第二个段落</p>
</template>
<script setup>
import { ref } from 'vue';
const age = ref(18)
const flag = ref(false)
</script>